<script setup>
import { ref, reactive, toRaw, nextTick } from 'vue';
import { service, cache } from '@utils';
import { ElMessage } from 'element-plus';
import Upload from '@components/Upload';
import { Delete, Plus } from '@element-plus/icons-vue';

const emit = defineEmits(['refresh']);

defineProps({
    expressMethods: Array,
    newOrOld: Array,
    categorys: Array,
});

const visible = ref(false);
const formRef = ref();
const isDisableds = ref(false);
const dialogTitle = ref();
const state = reactive({
    param: null,
    oldParam: [],
    type: '',
    rentDate: ['30', '60', '90', '120', '150', '180', '210', '240', '270', '300', '330', '360'],
    disabledRentDate: [],
    rent: {
        rent30: [],
        rent60: [],
        rent90: [],
        rent120: [],
        rent150: [],
        rent180: [],
        rent210: [],
        rent240: [],
        rent270: [],
        rent300: [],
        rent330: [],
        rent360: [],
        marketPrice: [],
    },
});

const rules = {
    name: [{ required: true, message: '请输入', trigger: 'blur' }],
    goodsCategoryId: [{ required: true, message: '请选择', trigger: 'change' }],
    startRentDays: [{ required: true, message: '请输入', trigger: 'blur' }],
    rentPriceForDay: [{ required: true, message: '请输入', trigger: 'blur' }],
    protect: [{ required: true, message: '请输入', trigger: 'blur' }],
    fastMail: [{ required: true, message: '请选择', trigger: 'change' }],
    cover: [{ required: true, message: '请选择', trigger: 'blur' }],
    mainPic: [{ required: true, message: '请选择', trigger: 'blur' }],
    detailPic: [{ required: true, message: '请选择', trigger: 'blur' }],
    newAndOldDegree: [{ required: true, message: '请选择', trigger: 'change' }],
};

const open = (item, isdisabled, title) => {
    state.param = { ...item };
    if (item) {
        state.oldParam = { ...item };
    }
    isDisableds.value = isdisabled;
    dialogTitle.value = title;
    nextTick(() => {
        getSkus();
    });
    visible.value = true;
};

const close = () => {
    visible.value = false;
    // state.param = {};
};

const getSkus = async () => {
    state.oldParam.skus = [];
    let res2 = await service.bfqz.LeasePeriodSwitchList({});
    let skusRent = JSON.parse(JSON.stringify(state.rent));
    let resData = res2.sort((a, b) => {
        return a.id - b.id;
    });
    state.disabledRentDate = resData;
    if (!state.param.goodsId) {
        state.param.skus = [{ model: '国行', leaseMethod: 0, requiredProtect: 0, ...skusRent }];
        state.type = '添加';
        return;
    }
    state.type = '修改';
    let res = await service.bfqz.goodsDetailAll({ goodsId: state.param.goodsId });
    state.param = res;
    state.oldParam = JSON.parse(JSON.stringify(res));
    let skus = JSON.parse(JSON.stringify(res && res.skus.length > 0 ? res.skus : [{ model: '国行', leaseMethod: 0, requiredProtect: 0 }]));
    skus.forEach((item, index) => {
        state.rentDate.forEach((jtem, index2) => {
            // if (jtem == 360) {
            //     if (item.rent360) {
            //         item.active360 = resData[index2].status != 1 && dialogTitle.value == '修改' ? false : true;
            //         // item.active360 = dialogTitle.value == '修改' ? false : true;
            //         item.isShow360 = true;
            //     } else {
            //         item.isShow360 = false;
            //         item.rent360 = [];
            //     }
            // } else {
                if (item['rent' + jtem]) {
                    item['active' + jtem] = resData[index2].status != 1 && dialogTitle.value == '修改' ? false : true;
                    // item['active' + jtem] = dialogTitle.value == '修改' ? false : true;
                    item['isShow' + jtem] = true;
                } else {
                    item['active' + jtem] = false;
                    item['isShow' + jtem] = false;
                    item['rent' + jtem] = [];
                }
            // }
        });
    });
    console.log(skus);
    // nextTick(() => {
        state.param.skus = skus;
        state.oldParam.skus = JSON.parse(JSON.stringify(skus));
    // });
    console.log(state.param.skus)
};

const deleteRow = index => {
    if (index === 0) return;
    state.param.skus.splice(index, 1);
};

const isNumEmpty = val => {
    if (typeof val === 'number') return false;
    return !val;
};

const addRow = () => {
    let item = state.param.skus[state.param.skus.length - 1];
    let bool = true;
    if ((item.active30 && item.buyOutPrice30 < 0) || (item.active60 && item.buyOutPrice60 < 0) || (item.active90 && item.buyOutPrice90 < 0) || (item.active120 && item.buyOutPrice120 < 0) || (item.active150 && item.buyOutPrice150 < 0) || (item.active180 && item.buyOutPrice180 < 0) || (item.active210 && item.buyOutPrice210 < 0) || (item.active240 && item.buyOutPrice240 < 0) || (item.active270 && item.buyOutPrice270 < 0) || (item.active300 && item.buyOutPrice300 < 0) || (item.active330 && item.buyOutPrice330 < 0) || (item.active360 && item.buyOutPrice360 < 0)) {
        ElMessage.warning('租金过高');
        bool = false;
        return;
    }
    if ((item.leaseMethod == 1 ? true : !item.active30) && !item.active60 && !item.active90 && !item.active120 && !item.active150 && !item.active180 && !item.active210 && !item.active240 && !item.active270 && !item.active300 && !item.active330 && !item.active360) {
        bool = false;
        ElMessage.warning('请选择租期及租金');
        return;
    }
    let skusRent = JSON.parse(JSON.stringify(state.rent));
    formRef.value.validate(valid => {
        if (valid && bool) {
            state.param.skus.push({
                model: '国行',
                leaseMethod: 0,
                requiredProtect: 0,
                ...skusRent,
            });
        } else {
            ElMessage.warning('请检查基本信息 和 商品SKU');
            marketPrice;
        }
    });
};
const leaseChange = i => {
    let paramItem = state.param.skus[i];
    let oldParamItem = state.oldParam.skus[i];
    console.log(oldParamItem)
    let newParamItem = {};
    if (state.oldParam.skus.length > 0 && paramItem.leaseMethod == oldParamItem.leaseMethod) {
        newParamItem = JSON.parse(JSON.stringify(oldParamItem));
    } else {
        let data = state.rentDate;
        data.forEach(item => {
            paramItem['active' + item] = false;
            paramItem.active360 = false;
            if (paramItem.leaseMethod == 0) {
                paramItem['rent' + item] = [];
                // paramItem.rent360 = [];
            }
            if (paramItem.leaseMethod == 1) {
                paramItem['buyOutPrice' + item] = null;
            }
        });
        newParamItem = paramItem;
    }
    state.param.skus[i] = newParamItem;
};
const exemptionChange = i => {
    if (state.param.skus[i].enableDepositFree == 0) {
        delete state.param.skus[i].maximumDepositFree;
        // state.param.skus[i].maximumDepositFree  = null;
    } else if (state.param.skus[i].enableDepositFree == 1) {
        state.param.skus[i].maximumDepositFree = state.param.skus[i].deposit;
    }
};
const depositChange = i => {
    if (state.param.skus[i].deposit == 0) {
        state.param.skus[i].enableDepositFree = 0;
        state.param.skus[i].enableDisabled = true;
    } else {
        state.param.skus[i].enableDisabled = false;
    }
    if (state.param.skus[i].deposit < state.param.skus[i].maximumDepositFree) {
        state.param.skus[i].maximumDepositFree = state.param.skus[i].deposit;
    }
};
//计算租金
const takePrice = arr => {
    if (arr && arr.length > 0) {
        let num = 0;
        arr.forEach(item => {
            if (item) {
                num = num + item * 1;
            }
        });
        return parseFloat(num).toFixed(2);
    } else {
        return parseFloat(0).toFixed(2);
    }
};
//计算签约价
const takeMarkePrice = (arr, buyPrice) => {
    if (arr && arr.length > 0) {
        let num = 0;
        arr.forEach(item => {
            if (item) {
                num = num + item * 1;
            }
        });
        return parseFloat(num + (buyPrice ? buyPrice * 1 : 0)).toFixed(2);
    } else {
        return parseFloat(0).toFixed(2);
    }
};

//自动给最低日租金与起租天数进行赋值
const takeStartRentDay = (el, index) => {
    if (el) {
        let rentPriceForDay = 0;
        let startRentDay = 0;
        state.param.skus.forEach(item => {
            el = item;
            // if (el.rent1) {
            //     if (startRentDay == 0 || 1 < startRentDay) startRentDay = 1
            //     if (el.rent1 < rentPriceForDay || rentPriceForDay == 0)
            //         rentPriceForDay = el.rent1
            // }
            // if (el.rent7) {
            //     if (startRentDay == 0 || 7 < startRentDay) startRentDay = 7
            //     if (el.rent7 < rentPriceForDay || rentPriceForDay == 0)
            //         rentPriceForDay = el.rent7
            // }
            if (el.rent30 && el.active30) {
                if (startRentDay == 0 || 30 < startRentDay) startRentDay = 30;
                if (el.rent30 < rentPriceForDay || rentPriceForDay == 0) rentPriceForDay = el.rent30;
            }
            if (el.rent60 && el.active60) {
                if (startRentDay == 0 || 60 < startRentDay) startRentDay = 60;
                if (el.rent60 < rentPriceForDay || rentPriceForDay == 0) rentPriceForDay = el.rent60;
            }
            if (el.rent90 && el.active90) {
                if (startRentDay == 0 || 90 < startRentDay) startRentDay = 90;
                if (el.rent90 < rentPriceForDay || rentPriceForDay == 0) rentPriceForDay = el.rent90;
            }
            if (el.rent120 && el.active120) {
                if (startRentDay == 0 || 120 < startRentDay) startRentDay = 120;
                if (el.rent120 < rentPriceForDay || rentPriceForDay == 0) rentPriceForDay = el.rent120;
            }
            if (el.rent150 && el.active150) {
                if (startRentDay == 0 || 150 < startRentDay) startRentDay = 150;
                if (el.rent150 < rentPriceForDay || rentPriceForDay == 0) rentPriceForDay = el.rent150;
            }
            if (el.rent180 && el.active180) {
                if (startRentDay == 0 || 180 < startRentDay) startRentDay = 180;
                if (el.rent180 < rentPriceForDay || rentPriceForDay == 0) rentPriceForDay = el.rent180;
            }
            if (el.rent210 && el.active210) {
                if (startRentDay == 0 || 210 < startRentDay) startRentDay = 210;
                if (el.rent210 < rentPriceForDay || rentPriceForDay == 0) rentPriceForDay = el.rent210;
            }
            if (el.rent240 && el.active240) {
                if (startRentDay == 0 || 240 < startRentDay) startRentDay = 240;
                if (el.rent240 < rentPriceForDay || rentPriceForDay == 0) rentPriceForDay = el.rent240;
            }
            if (el.rent270 && el.active270) {
                if (startRentDay == 0 || 270 < startRentDay) startRentDay = 270;
                if (el.rent270 < rentPriceForDay || rentPriceForDay == 0) rentPriceForDay = el.rent270;
            }
            if (el.rent300 && el.active300) {
                if (startRentDay == 0 || 300 < startRentDay) startRentDay = 300;
                if (el.rent300 < rentPriceForDay || rentPriceForDay == 0) rentPriceForDay = el.rent300;
            }
            if (el.rent330 && el.active330) {
                if (startRentDay == 0 || 330 < startRentDay) startRentDay = 330;
                if (el.rent330 < rentPriceForDay || rentPriceForDay == 0) rentPriceForDay = el.rent330;
            }
            if (el.rent360) {
                if (startRentDay == 0 || 365 < startRentDay) startRentDay = 365;
                if (el.rent360 < rentPriceForDay || rentPriceForDay == 0) rentPriceForDay = el.rent360;
            }
        });
        state.param.rentPriceForDay = rentPriceForDay;
        state.param.startRentDays = startRentDay;
    }
};

const sure = async () => {
    let skus = state.param.skus;
    let bool = false;
    let item = {};
    for (let i = 0; i < skus.length; i++) {
        item = skus[i];
        if (!!item.active30 || !!item.active60 || !!item.active90 || !!item.active120 || !!item.active150 || !!item.active180 || !!item.active210 || !!item.active240 || !!item.active270 || !!item.active300 || !!item.active330 || !!item.active360) {
            bool = true;
        } else {
            bool = false;
            ElMessage.warning('请选择租金及租期');
            return;
        }
        if ((item.active30 && item.buyOutPrice30 < 0) || (item.active60 && item.buyOutPrice60 < 0) || (item.active90 && item.buyOutPrice90 < 0) || (item.active120 && item.buyOutPrice120 < 0) || (item.active150 && item.buyOutPrice150 < 0) || (item.active180 && item.buyOutPrice180 < 0) || (item.active210 && item.buyOutPrice210 < 0) || (item.active240 && item.buyOutPrice240 < 0) || (item.active270 && item.buyOutPrice270 < 0) || (item.active300 && item.buyOutPrice300 < 0) || (item.active330 && item.buyOutPrice330 < 0) || (item.active360 && item.buyOutPrice360 < 0)) {
            ElMessage.warning('租金过高,买断价为负数');
            return;
        }
    }
    formRef.value.validate(valid => {
        if (valid && bool) {
            realSubmit();
        } else {
            ElMessage.warning('请检查基本信息 和 商品SKU');
        }
    });
};
const realSubmit = async () => {
    // let skus = JSON.parse(JSON.stringify(state.param.skus))
    let param = JSON.parse(JSON.stringify(state.param));
    let rentPriceForDay = 0;
    let startRentDay = 0;
    param.skus.forEach(item => {
        let el = item;
        if (el.payDepositType && el.payDepositType == 1) {
            el.enableDepositFree = 0;
            el.maximumDepositFree = '';
        }
        if (el.rent30 && el.active30) {
            if (startRentDay == 0 || 30 < startRentDay) startRentDay = 30;
            // if (el.rent30 < rentPriceForDay || rentPriceForDay == 0)
            //     rentPriceForDay = el.rent30 * 1
        }
        if (el.rent60 && el.active60) {
            if (startRentDay == 0 || 60 < startRentDay) startRentDay = 60;
            // if (el.rent60 < rentPriceForDay || rentPriceForDay == 0)
            //     rentPriceForDay = el.rent60 * 1
        }
        if (el.rent90 && el.active90) {
            if (startRentDay == 0 || 90 < startRentDay) startRentDay = 90;
            // if (el.rent90 < rentPriceForDay || rentPriceForDay == 0)
            //     rentPriceForDay = el.rent90 * 1
        }
        if (el.rent120 && el.active120) {
            if (startRentDay == 0 || 120 < startRentDay) startRentDay = 120;
            // if (el.rent120 < rentPriceForDay || rentPriceForDay == 0)
            //     rentPriceForDay = el.rent120 * 1
        }
        if (el.rent150 && el.active150) {
            if (startRentDay == 0 || 150 < startRentDay) startRentDay = 150;
            // if (el.rent150 < rentPriceForDay || rentPriceForDay == 0)
            //     rentPriceForDay = el.rent150 * 1
        }
        if (el.rent180 && el.active180) {
            if (startRentDay == 0 || 180 < startRentDay) startRentDay = 180;
            // if (el.rent180 < rentPriceForDay || rentPriceForDay == 0)
            //     rentPriceForDay = el.rent180 * 1
        }
        if (el.rent210 && el.active210) {
            if (startRentDay == 0 || 210 < startRentDay) startRentDay = 210;
            // if (el.rent210 < rentPriceForDay || rentPriceForDay == 0)
            //     rentPriceForDay = el.rent210 * 1
        }
        if (el.rent240 && el.active240) {
            if (startRentDay == 0 || 240 < startRentDay) startRentDay = 240;
            // if (el.rent240 < rentPriceForDay || rentPriceForDay == 0)
            //     rentPriceForDay = el.rent240 * 1
        }
        if (el.rent270 && el.active270) {
            if (startRentDay == 0 || 270 < startRentDay) startRentDay = 270;
            // if (el.rent270 < rentPriceForDay || rentPriceForDay == 0)
            //     rentPriceForDay = el.rent270 * 1
        }
        if (el.rent300 && el.active300) {
            if (startRentDay == 0 || 300 < startRentDay) startRentDay = 300;
            // if (el.rent300 < rentPriceForDay || rentPriceForDay == 0)
            //     rentPriceForDay = el.rent300 * 1
        }
        if (el.rent330 && el.active330) {
            if (startRentDay == 0 || 330 < startRentDay) startRentDay = 330;
            // if (el.rent330 < rentPriceForDay || rentPriceForDay == 0)
            //     rentPriceForDay = el.rent330 * 1
        }
        if (el.rent360 && el.active360) {
            if (startRentDay == 0 || 365 < startRentDay) startRentDay = 365;
            // if (el.rent360 < rentPriceForDay || rentPriceForDay == 0)
            //     rentPriceForDay = el.rent360 * 1
        }
        state.rentDate.forEach(jtem => {
            if (jtem == 360) {
                if (!item.active360) {
                    delete item.rent360;
                    delete item.buyOutPrice360;
                }
                delete item.active360;
            } else {
                if (!item['active' + jtem]) {
                    delete item['rent' + jtem];
                    delete item['buyOutPrice' + jtem];
                }
                delete item['active' + jtem];
            }
            if (item.leaseMethod == 1) {
                delete item.rent30;
                delete item['buyOutPrice' + jtem];
            }
        });

        delete item.rent1;
        delete item.rent7;
        delete item.leasePeriodSwitch;
    });
    // state.param.rentPriceForDay = parseFloat(rentPriceForDay).toFixed(2)
    param.startRentDays = startRentDay;
    let res;
    if (state.type == '添加') {
        res = await service.bfqz.goodsAdd(toRaw(param));
    } else {
        res = await service.bfqz.goodsEdit(toRaw(param));
    }
    if (res) {
        ElMessage.success(state.type + '成功');
        close();
        emit('refresh', !!state.param.id);
    }
};

//把方法暴露给父组件
defineExpose({
    open,
});
</script>
<template>
    <el-dialog v-model="visible" :title="dialogTitle" center :close-on-click-modal="false" @close="close" destroy-on-close top="6vh" width="1200px">
        <el-form :model="state.param" :disabled="isDisableds" :rules="rules" ref="formRef" label-width="120px" label-suffix=":" onsubmit="return false;" style="min-width: 80%">
            <el-tabs type="border-card" width="100%">
                <el-tab-pane label="基本信息">
                    <section style="max-height: 60vh" class="scroll-y paddingR10">
                        <el-row>
                            <el-col :span="12">
                                <el-form-item label="商品名称" prop="name">
                                    <el-input v-model="state.param.name" placeholder="请输入商品名称" :maxlength="35" clearable></el-input>
                                </el-form-item>
                            </el-col>
                            <!-- <el-col :span="8">
                                <el-form-item label="免费服务">
                                    <el-checkbox v-model="state.param.bayOut" label="买断" />
                                    <el-checkbox v-model="state.param.relet" label="续租" />
                                </el-form-item>
                            </el-col> -->
                            <el-col :span="12">
                                <el-form-item label="商品分类" prop="goodsCategoryId">
                                    <el-cascader v-model="state.param.goodsCategoryId" :options="categorys" :props="{ value: 'goodsCategoryId' }" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="12">
                                <el-form-item label="新旧程度" prop="newAndOldDegree">
                                    <el-select v-model="state.param.newAndOldDegree" style="width: 100%" placeholder="请选择新旧程度" clearable>
                                        <el-option v-for="{ label, value } in newOrOld" :key="value" :label="label" :value="value" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <!-- <el-row>
                            <el-col :span="8">
                                <el-form-item label="起租天数" prop="startRentDays">
                                    <el-input-number v-model="state.param.startRentDays" style="width: 100%"
                                        placeholder="请输入数字" :precision="0" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="8">
                                <el-form-item label="最低日租金" prop="rentPriceForDay">
                                    <el-input-number v-model="state.param.rentPriceForDay" :controls="false"
                                        style="width: 100%" placeholder="请输入数字" :precision="2" />
                                </el-form-item>
                            </el-col>
                            <el-col :span="8">
                                <el-form-item label="意外保障" prop="protect">
                                    <el-input-number v-model="state.param.protect" :controls="false" style="width: 100%"
                                        placeholder="请输入数字" :precision="2" />
                                </el-form-item>
                            </el-col>
                        </el-row> -->
                        <!-- <el-row>
                            <el-col :span="8">
                                <el-form-item label="租金比例" prop="rentRatio">
                                    <el-input v-model="state.param.rentRatio" placeholder="请输入租金比例" clearable>
                                        <template #append>%</template>
                                    </el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8">
                                <el-form-item label="买断比例" prop="buyRatio">
                                    <el-input v-model="state.param.buyRatio" placeholder="请输入买断比例" clearable>
                                        <template #append>%</template>
                                    </el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8">
                                
                            </el-col>
                        </el-row> -->
                        <el-form-item label="封面图" prop="cover">
                            <upload class="cover" v-model="state.param.cover" show-tip :disabled="isDisableds" :limit="1" />
                        </el-form-item>
                        <el-form-item label="商品主图" prop="mainPic">
                            <upload class="mainPic" v-model="state.param.mainPic" show-tip :disabled="isDisableds" :limit="10" />
                        </el-form-item>
                        <el-form-item label="商品详情" prop="detailPic">
                            <upload class="detailPic" v-model="state.param.detailPic" show-tip :disabled="isDisableds" :size="5120" :limit="20" />
                        </el-form-item>
                    </section>
                </el-tab-pane>
                <el-tab-pane label="商品SKU">
                    <section style="max-height: 60vh" class="scroll-y paddingR5">
                        <el-form-item prop="skus" label-width="0">
                            <div class="flex1">
                                <el-card v-for="(item, index) in state.param.skus" :key="index" class="marginT15">
                                    <template #header>
                                        <div class="flex-align-between">
                                            <div class="font3 color-2">商品规格</div>
                                            <div class="flex-align">
                                                <el-button v-if="index == state.param.skus.length - 1" type="primary" :icon="Plus" circle @click="addRow"></el-button>
                                                <el-button v-if="index != 0" type="danger" :icon="Delete" circle @click="deleteRow(index)"></el-button>
                                            </div>
                                        </div>
                                    </template>
                                    <el-row>
                                        <el-col :span="8">
                                            <el-form-item label="型号" :prop="`skus.${index}.model`" :rules="[{ required: true, message: '请输入' }]">
                                                <el-input v-model="item.model" placeholder="请输入型号" clearable maxlength="10"></el-input>
                                            </el-form-item>
                                        </el-col>
                                        <el-col :span="8">
                                            <el-form-item label="颜色" :prop="`skus.${index}.color`" :rules="[{ required: true, message: '请输入' }]">
                                                <el-input v-model="item.color" placeholder="请输入颜色" clearable maxlength="10"></el-input>
                                            </el-form-item>
                                        </el-col>
                                        <el-col :span="8">
                                            <el-form-item label="内存规格" :prop="`skus.${index}.norms`" :rules="[{ required: true, message: '请输入' }]">
                                                <el-input v-model="item.norms" placeholder="请输入内存规格" clearable maxlength="10"></el-input>
                                            </el-form-item>
                                        </el-col>
                                    </el-row>
                                    <el-row class="marginT20">
                                        <!-- <el-col :span="8">
                                            <el-form-item label="溢价" :prop="`skus.${index}.premium`"
                                                :rules="[{ required: true, message: '请输入' }]">
                                                <el-input-number v-model="item.premium" placeholder="请输入溢价" clearable
                                                    :precision="2" :controls="false" style="width: 100%" />
                                            </el-form-item>
                                        </el-col> -->
                                        <!-- <el-col :span="8">
                                            <el-form-item label="产品签约价值" :prop="`skus.${index}.marketPrice`" :rules="[{ required: true, message: '请输入' }]">
                                                <el-input v-model="item.marketPrice" placeholder="请输入市场价" clearable :min="1" :precision="2" :max="99999" :controls="false" align="left" style="width: 100%" type="number">
                                                    <template #append>
                                                        <el-popover placement="bottom" :width="220" trigger="hover" popper-style="padding:5px 12px;">
                                                            <template #reference>
                                                                <img class="hoverTitle" src="@image/icon_priceAppend.png" alt="" /> -->
                                        <!-- <span class="hoverTitle">i</span> -->
                                        <!-- </template>
                                                            <span>产品签约价值等于订单总金额</span>
                                                        </el-popover>
                                                    </template>
                                                </el-input>
                                            </el-form-item>
                                        </el-col> -->
                                        <!-- <el-col :span="8">
                                            <el-form-item
                                                label="新旧程度"
                                                :prop="`skus.${index}.newAndOldDegree`"
                                                :rules="[{ required: true, message: '请选择' }]"
                                            >
                                                <el-select
                                                    v-model="item.newAndOldDegree"
                                                    style="width: 100%"
                                                    placeholder="请选择新旧程度"
                                                    clearable
                                                >
                                                    <el-option
                                                        v-for="{ label, val } in newOrOld"
                                                        :key="val"
                                                        :label="label"
                                                        :value="val"
                                                    />
                                                </el-select>
                                            </el-form-item>
                                        </el-col> -->
                                        <el-col :span="8">
                                            <el-form-item label="押金" :prop="`skus.${index}.deposit`" :rules="[{ required: true, message: '请输入' }]">
                                                <el-input-number :change="depositChange(index)" v-model="item.deposit" placeholder="请输入押金" clearable :min="0" :precision="2" :max="99999" :controls="false" style="width: 100%" />
                                            </el-form-item>
                                        </el-col>
                                        <el-col :span="8">
                                            <el-form-item label="库存" :prop="`skus.${index}.stock`" :rules="[{ required: true, message: '请输入' }]">
                                                <el-input-number v-model="item.stock" placeholder="请输入库存" clearable :min="1" :precision="0" :max="99999" :controls="false" style="width: 100%" />
                                            </el-form-item>
                                        </el-col>
                                        <el-col :span="8">
                                            <el-form-item label="意外保障" :prop="`skus.${index}.protect`" :rules="[{ required: true, message: '请输入' }]">
                                                <el-input-number v-model="item.protect" :controls="false" style="width: 100%" placeholder="请输入意外保障金" :precision="2" />
                                            </el-form-item>
                                        </el-col>
                                    </el-row>
                                    <!-- <el-row class="marginT20">
                                        
                                    </el-row> -->
                                    <el-row class="marginT20">
                                        <el-form-item label="是否使用支付宝免押服务" :prop="`skus.${index}.enableDepositFree`" :rules="[{ required: true, message: '请选择' }]" :label-width="190">
                                            <el-radio-group v-model="item.enableDepositFree" @change="exemptionChange(index)" :defaultVal="0">
                                                <el-radio :label="1" :disabled="item.enableDisabled">
                                                    是
                                                    <span v-if="item.enableDepositFree == 1">最高免押额度</span>
                                                </el-radio>
                                                <el-form-item :prop="`skus.${index}.protect`" :rules="[{ required: true, message: '请选择' }]" style="width: 150px; margin-right: 32px" v-if="item.enableDepositFree == 1">
                                                    <el-input-number v-model="item.maximumDepositFree" :controls="false" style="width: 100%" placeholder="请输入数字" :precision="2" :max="item.deposit" :min="0.01" />
                                                </el-form-item>
                                                <el-radio :label="0">
                                                    否
                                                    <span v-if="item.enableDisabled" style="color: #008dffbf; margin-left: 20px">!商品押金为0，无需支付宝免押</span>
                                                </el-radio>
                                            </el-radio-group>
                                        </el-form-item>
                                        <br />
                                    </el-row>
                                    <el-row class="marginT20">
                                        <el-form-item label="意外保障金是否必选" :prop="`skus.${index}.requiredProtect`" :rules="[{ required: true, message: '请输入' }]" :label-width="190">
                                            <el-radio-group v-model="item.requiredProtect">
                                                <el-radio :label="1">是</el-radio>
                                                <el-radio :label="0">否</el-radio>
                                            </el-radio-group>
                                        </el-form-item>
                                    </el-row>
                                    <el-row class="marginT20">
                                        <el-col :span="8">
                                            <el-form-item label="SKU图片" :prop="`skus.${index}.skuPic`" :rules="[{ required: true, message: '请选择' }]">
                                                <upload class="cover" v-model="item.skuPic" show-tip :disabled="isDisableds" :limit="1" />
                                            </el-form-item>
                                        </el-col>
                                    </el-row>
                                    <el-row class="marginT20">
                                        <el-form-item label="租赁类型" :prop="`skus.${index}.leaseMethod`" :rules="[{ required: true, message: '请选择' }]">
                                            <el-radio-group v-model="item.leaseMethod" @change="leaseChange(index)">
                                                <el-radio :label="0">先租后买</el-radio>
                                                <el-radio :label="1">租完即送</el-radio>
                                            </el-radio-group>
                                        </el-form-item>
                                    </el-row>
                                    <el-row class="marginT20" v-if="item.leaseMethod == 1 && item.deposit > 0">
                                        <el-form-item label="押金支付方式" :prop="`skus.${index}.payDepositType`" :rules="[{ required: true, message: '请选择' }]">
                                            <el-radio-group v-model="item.payDepositType">
                                                <el-radio :label="1">下单时支付</el-radio>
                                                <el-radio :label="2">收货时支付</el-radio>
                                            </el-radio-group>
                                        </el-form-item>
                                    </el-row>
                                    <el-row class="marginT20">
                                        <el-form-item label="快递方式" :prop="`skus.${index}.postType`" :rules="[{ required: true, message: '请选择' }]">
                                            <el-radio-group v-model="item.postType">
                                                <el-radio v-for="{ label, value } in expressMethods" :key="value" :label="value * 1">
                                                    {{ label }}
                                                </el-radio>
                                            </el-radio-group>
                                        </el-form-item>
                                    </el-row>
                                    <section>
                                        <!-- <el-col :span="8">
                                                <el-form-item label="1天及以上" :prop="`skus.${index}.rent1`">
                                                    <el-input-number v-model="item.rent1" placeholder="请输入数字" clearable :min="0"
                                                        :precision="2" :max="99999" :controls="false" style="width: 100%"
                                                        @blur="takeStartRentDay(item)"/>
                                                </el-form-item>
                                            </el-col> -->
                                        <!-- <el-col :span="8">
                                                <el-form-item label="7天及以上" :prop="`skus.${index}.rent7`">
                                                    <el-input-number v-model="item.rent7" placeholder="请输入数字" clearable :min="0"
                                                        :precision="2" :max="99999" :controls="false" style="width: 100%"
                                                        @blur="takeStartRentDay(item)" />
                                                </el-form-item>
                                            </el-col> -->
                                        <div class="font2 color-2 marginT20">
                                            <span style="color: rgb(245, 108, 108)">*</span>
                                            租期及租金:
                                        </div>
                                        <span class="warinText" v-if="!item.active30 && !item.active60 && !item.active90 && !item.active120 && !item.active150 && !item.active180 && !item.active210 && !item.active240 && !item.active270 && !item.active300 && !item.active330 && !item.active360">请选择租期及租金</span>
                                        <!-- 单期 -->
                                        <el-row class="marginT20" :class="dialogTitle == '修改' && state.disabledRentDate[0].status != 1 ? 'disabledRow' : ''" style="clear: both" v-if="dialogTitle == '新增' ? item.leaseMethod == 0 && state.disabledRentDate[0].status == 1 : dialogTitle == '修改' ? item.leaseMethod == 0 && (state.disabledRentDate[0].status == 1 || item.isShow30) : item.leaseMethod == 0 && item.isShow30">
                                            <el-col :span="4">
                                                <el-form-item>
                                                    <el-checkbox :checked="false" v-model="item.active30" :disabled="dialogTitle == '修改' && state.disabledRentDate[0].status != 1" label="单期/租期30天" />
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="20">
                                                <el-row :class="!item.active30 ? 'errorShow' : ''">
                                                    租金(元/期) :
                                                    <div class="priceDiv">
                                                        <div>
                                                            <el-form-item
                                                                class="inputNumStyle"
                                                                :prop="`skus.${index}.rent30.${0}`"
                                                                :rules="[
                                                                    {
                                                                        required: item.active30,
                                                                        message: `请输入第1期租金`,
                                                                    },
                                                                ]"
                                                            >
                                                                <el-input-number v-model="item.rent30[0]" placeholder="第一期租金" clearable :min="0.01" :precision="2" :disabled="!item.active30" controls-position="right" />
                                                            </el-form-item>
                                                        </div>
                                                    </div>
                                                    <span>
                                                        总租金 :
                                                        {{ item.active30 ? takePrice(item.rent30) : 0.0 }}
                                                        元
                                                    </span>
                                                    <span style="margin-left: 10px">买断价(元) :&nbsp;</span>
                                                    <el-form-item
                                                        :prop="`skus.${index}.buyOutPrice30`"
                                                        :rules="[
                                                            {
                                                                required: item.active30,
                                                                message: '请输入买断价',
                                                            },
                                                        ]"
                                                    >
                                                        <el-input-number v-model="item.buyOutPrice30" placeholder="请输入买断价" clearable :min="0.01" :precision="2" :disabled="!item.active30" controls-position="right" />
                                                    </el-form-item>
                                                    <span style="margin-left: 10px">
                                                        产品签约价值(元) :
                                                        {{ (item.marketPrice[0] = item.active30 ? takeMarkePrice(item.rent30, item.buyOutPrice30) : '0.00') }}元
                                                    </span>
                                                </el-row>
                                            </el-col>
                                            <el-col :span="24" class="warinTextRent">
                                                <span>此租期目前暂不开放</span>
                                            </el-col>
                                        </el-row>
                                        <!-- 两期 -->
                                        <el-row class="marginT20" :class="dialogTitle == '修改' && state.disabledRentDate[1].status != 1 ? 'disabledRow' : ''" v-if="dialogTitle == '新增' ? state.disabledRentDate[1].status == 1 : dialogTitle == '修改' ? state.disabledRentDate[1].status == 1 || item.isShow60 : item.isShow60">
                                            <el-col :span="4">
                                                <el-form-item>
                                                    <el-checkbox :disabled="dialogTitle == '修改' && state.disabledRentDate[1].status != 1" v-model="item.active60" label="两期/租期60天" />
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="20">
                                                <el-row :class="!item.active60 ? 'errorShow' : ''">
                                                    租金(元/期) :
                                                    <div class="priceDiv">
                                                        <div v-for="i in 2" :key="'rent60' + i">
                                                            <el-form-item
                                                                class="inputNumStyle"
                                                                :prop="`skus.${index}.rent60.${i - 1}`"
                                                                :rules="[
                                                                    {
                                                                        required: item.active60,
                                                                        message: `请输入第${i}期租金`,
                                                                    },
                                                                ]"
                                                            >
                                                                <el-input-number v-model="item.rent60[i - 1]" :placeholder="`第${i}期租金`" clearable :min="0.01" :precision="2" :disabled="!item.active60" controls-position="right" />
                                                            </el-form-item>
                                                        </div>
                                                    </div>
                                                    <span>
                                                        总租金 :
                                                        {{ item.active60 ? takePrice(item.rent60) : 0 }}
                                                        元
                                                    </span>
                                                    <span style="margin-left: 10px" v-if="item.leaseMethod == 0">买断价(元):&nbsp;</span>
                                                    <el-form-item
                                                        :prop="`skus.${index}.buyOutPrice60`"
                                                        v-if="item.leaseMethod == 0"
                                                        :rules="[
                                                            {
                                                                required: item.active60,
                                                                message: '请输入买断价',
                                                            },
                                                        ]"
                                                    >
                                                        <el-input-number v-model="item.buyOutPrice60" placeholder="请输入买断价" clearable :min="0.01" :precision="2" :disabled="!item.active60" controls-position="right" />
                                                    </el-form-item>
                                                    <br />
                                                    <span style="margin-left: 10px">
                                                        产品签约价值(元) :
                                                        {{ (item.marketPrice[1] = item.active60 ? takeMarkePrice(item.rent60, item.buyOutPrice60) : '0.00') }}元
                                                    </span>
                                                </el-row>
                                                <el-col :span="24" class="warinTextRent">
                                                    <span>此租期目前暂不开放</span>
                                                </el-col>
                                            </el-col>
                                        </el-row>
                                        <!-- 三期 -->
                                        <el-row class="marginT20" :class="dialogTitle == '修改' && state.disabledRentDate[2].status != 1 ? 'disabledRow' : ''" v-if="dialogTitle == '新增' ? state.disabledRentDate[2].status == 1 : dialogTitle == '修改' ? state.disabledRentDate[2].status == 1 || item.isShow90 : item.isShow90">
                                            <el-col :span="4">
                                                <el-form-item>
                                                    <el-checkbox v-model="item.active90" :disabled="dialogTitle == '修改' && state.disabledRentDate[2].status != 1" label="三期/租期90天" />
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="20">
                                                <el-row :class="!item.active90 ? 'errorShow' : ''">
                                                    租金(元/期) :
                                                    <div class="priceDiv">
                                                        <div v-for="i in 3" :key="'rent90' + i">
                                                            <el-form-item
                                                                class="inputNumStyle"
                                                                :prop="`skus.${index}.rent90.${i - 1}`"
                                                                :rules="[
                                                                    {
                                                                        required: item.active90,
                                                                        message: `请输入第${i}期租金`,
                                                                    },
                                                                ]"
                                                            >
                                                                <el-input-number v-model="item.rent90[i - 1]" :placeholder="`第${i}期租金`" clearable :min="0.01" :precision="2" :disabled="!item.active90" controls-position="right" style="" />
                                                            </el-form-item>
                                                        </div>
                                                    </div>
                                                    <span>
                                                        总租金 :
                                                        {{ item.active90 ? takePrice(item.rent90) : 0 }}
                                                        元
                                                    </span>
                                                    <span style="margin-left: 10px" v-if="item.leaseMethod == 0">买断价(元):&nbsp;</span>
                                                    <el-form-item
                                                        :prop="`skus.${index}.buyOutPrice90`"
                                                        v-if="item.leaseMethod == 0"
                                                        :rules="[
                                                            {
                                                                required: item.active90,
                                                                message: '请输入买断价',
                                                            },
                                                        ]"
                                                    >
                                                        <el-input-number v-model="item.buyOutPrice90" placeholder="请输入买断价" :disabled="!item.active90" clearable :min="0.01" :precision="2" controls-position="right" />
                                                    </el-form-item>
                                                    <br />
                                                    <span style="margin-left: 10px">
                                                        产品签约价值(元) :
                                                        {{ (item.marketPrice[2] = item.active90 ? takeMarkePrice(item.rent90, item.buyOutPrice90) : '0.00') }}元
                                                    </span>
                                                </el-row>
                                            </el-col>
                                            <el-col :span="24" class="warinTextRent">
                                                <span>此租期目前暂不开放</span>
                                            </el-col>
                                        </el-row>
                                        <!-- 四期 -->
                                        <el-row class="marginT20" :class="dialogTitle == '修改' && state.disabledRentDate[3].status != 1 ? 'disabledRow' : ''" v-if="dialogTitle == '新增' ? state.disabledRentDate[3].status == 1 : dialogTitle == '修改' ? state.disabledRentDate[3].status == 1 || item.isShow120 : item.isShow120">
                                            <el-col :span="4">
                                                <el-form-item>
                                                    <el-checkbox v-model="item.active120" :disabled="dialogTitle == '修改' && state.disabledRentDate[3].status != 1" label="四期/租期120天" />
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="20">
                                                <el-row :class="!item.active120 ? 'errorShow' : ''">
                                                    租金(元/期) :&nbsp;
                                                    <div class="priceDiv">
                                                        <div v-for="i in 4" :key="'rent120' + i">
                                                            <el-form-item
                                                                class="inputNumStyle"
                                                                :prop="`skus.${index}.rent120.${i - 1}`"
                                                                :rules="[
                                                                    {
                                                                        required: item.active120,
                                                                        message: `请输入第${i}期租金`,
                                                                    },
                                                                ]"
                                                            >
                                                                <el-input-number v-model="item.rent120[i - 1]" :placeholder="`第${i}期租金`" clearable :min="0.01" :precision="2" :disabled="!item.active120" controls-position="right" />
                                                            </el-form-item>
                                                        </div>
                                                    </div>
                                                    <span>
                                                        总租金 :
                                                        {{ item.active120 ? takePrice(item.rent120) : 0 }}
                                                        元
                                                    </span>
                                                    <span style="margin-left: 10px" v-if="item.leaseMethod == 0">买断价(元):&nbsp;</span>
                                                    <el-form-item
                                                        :prop="`skus.${index}.buyOutPrice120`"
                                                        v-if="item.leaseMethod == 0"
                                                        :rules="[
                                                            {
                                                                required: item.active120,
                                                                message: '请输入买断价',
                                                            },
                                                        ]"
                                                    >
                                                        <el-input-number v-model="item.buyOutPrice120" placeholder="请输入买断价" :disabled="!item.active120" clearable :min="0.01" :precision="2" controls-position="right" />
                                                    </el-form-item>
                                                    <span style="margin-left: 10px">
                                                        产品签约价值(元) :
                                                        {{ (item.marketPrice[3] = item.active120 ? takeMarkePrice(item.rent120, item.buyOutPrice120) : '0.00') }}元
                                                    </span>
                                                </el-row>
                                            </el-col>
                                            <el-col :span="24" class="warinTextRent">
                                                <span>此租期目前暂不开放</span>
                                            </el-col>
                                        </el-row>
                                        <!-- 五期 -->
                                        <el-row class="marginT20" :class="dialogTitle == '修改' && state.disabledRentDate[4].status != 1 ? 'disabledRow' : ''" v-if="dialogTitle == '新增' ? state.disabledRentDate[4].status == 1 : dialogTitle == '修改' ? state.disabledRentDate[4].status == 1 || item.isShow150 : item.isShow150">
                                            <el-col :span="4">
                                                <el-form-item>
                                                    <el-checkbox v-model="item.active150" :disabled="dialogTitle == '修改' && state.disabledRentDate[4].status != 1" label="五期/租期150天" />
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="20">
                                                <el-row :class="!item.active150 ? 'errorShow' : ''">
                                                    租金(元/期) :&nbsp;
                                                    <div class="priceDiv">
                                                        <div v-for="i in 5" :key="'rent150' + i">
                                                            <el-form-item
                                                                class="inputNumStyle"
                                                                :prop="`skus.${index}.rent150.${i - 1}`"
                                                                :rules="[
                                                                    {
                                                                        required: item.active150,
                                                                        message: `请输入第${i}期租金`,
                                                                    },
                                                                ]"
                                                            >
                                                                <el-input-number v-model="item.rent150[i - 1]" :placeholder="`第${i}期租金`" clearable :min="0.01" :precision="2" :disabled="!item.active150" controls-position="right" />
                                                            </el-form-item>
                                                        </div>
                                                    </div>
                                                    <span>
                                                        总租金 :
                                                        {{ item.active150 ? takePrice(item.rent150) : 0 }}
                                                        元
                                                    </span>
                                                    <span style="margin-left: 10px" v-if="item.leaseMethod == 0">买断价(元):&nbsp;</span>
                                                    <el-form-item
                                                        :prop="`skus.${index}.buyOutPrice150`"
                                                        v-if="item.leaseMethod == 0"
                                                        :rules="[
                                                            {
                                                                required: item.active150,
                                                                message: '请输入买断价',
                                                            },
                                                        ]"
                                                    >
                                                        <el-input-number v-model="item.buyOutPrice150" placeholder="请输入买断价" :disabled="!item.active150" clearable :min="0.01" :precision="2" controls-position="right" />
                                                    </el-form-item>
                                                    <span style="margin-left: 10px">
                                                        产品签约价值(元) :
                                                        {{ (item.marketPrice[4] = item.active150 ? takeMarkePrice(item.rent150, item.buyOutPrice150) : '0.00') }}元
                                                    </span>
                                                </el-row>
                                            </el-col>
                                            <el-col :span="24" class="warinTextRent">
                                                <span>此租期目前暂不开放</span>
                                            </el-col>
                                        </el-row>
                                        <!-- 六期 -->
                                        <el-row class="marginT20" :class="dialogTitle == '修改' && state.disabledRentDate[5].status != 1 ? 'disabledRow' : ''" v-if="dialogTitle == '新增' ? state.disabledRentDate[5].status == 1 : dialogTitle == '修改' ? state.disabledRentDate[5].status == 1 || item.isShow180 : item.isShow180">
                                            <el-col :span="4">
                                                <el-form-item>
                                                    <el-checkbox v-model="item.active180" :disabled="dialogTitle == '修改' && state.disabledRentDate[5].status != 1" label="六期/租期180天" />
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="20">
                                                <el-row :class="!item.active180 ? 'errorShow' : ''">
                                                    租金(元/期) :&nbsp;
                                                    <div class="priceDiv">
                                                        <div v-for="i in 6" :key="'rent180' + i">
                                                            <el-form-item
                                                                class="inputNumStyle"
                                                                :prop="`skus.${index}.rent180.${i - 1}`"
                                                                :rules="[
                                                                    {
                                                                        required: item.active180,
                                                                        message: `请输入第${i}期租金`,
                                                                    },
                                                                ]"
                                                            >
                                                                <el-input-number v-model="item.rent180[i - 1]" :placeholder="`第${i}期租金`" clearable :min="0.01" :precision="2" :disabled="!item.active180" controls-position="right" />
                                                            </el-form-item>
                                                        </div>
                                                    </div>
                                                    <span>
                                                        总租金 :
                                                        {{ item.active180 ? takePrice(item.rent180) : 0 }}
                                                        元
                                                    </span>
                                                    <span style="margin-left: 10px" v-if="item.leaseMethod == 0">买断价(元):&nbsp;</span>
                                                    <el-form-item
                                                        :prop="`skus.${index}.buyOutPrice180`"
                                                        v-if="item.leaseMethod == 0"
                                                        :rules="[
                                                            {
                                                                required: item.active180,
                                                                message: '请输入买断价',
                                                            },
                                                        ]"
                                                    >
                                                        <el-input-number v-model="item.buyOutPrice180" placeholder="请输入买断价" :disabled="!item.active180" clearable :min="0.01" :precision="2" controls-position="right" />
                                                    </el-form-item>
                                                    <span style="margin-left: 10px">
                                                        产品签约价值(元) :
                                                        {{ (item.marketPrice[5] = item.active180 ? takeMarkePrice(item.rent180, item.buyOutPrice180) : '0.00') }}元
                                                    </span>
                                                </el-row>
                                            </el-col>
                                            <el-col :span="24" class="warinTextRent">
                                                <span>此租期目前暂不开放</span>
                                            </el-col>
                                        </el-row>
                                        <!-- 七期 -->
                                        <el-row class="marginT20" :class="dialogTitle == '修改' && state.disabledRentDate[6].status != 1 ? 'disabledRow' : ''" v-if="dialogTitle == '新增' ? state.disabledRentDate[6].status == 1 : dialogTitle == '修改' ? state.disabledRentDate[6].status == 1 || item.isShow210 : item.isShow210">
                                            <el-col :span="4">
                                                <el-form-item>
                                                    <el-checkbox v-model="item.active210" :disabled="dialogTitle == '修改' && state.disabledRentDate[6].status != 1" label="七期/租期210天" />
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="20">
                                                <el-row :class="!item.active210 ? 'errorShow' : ''">
                                                    租金(元/期) :&nbsp;
                                                    <div class="priceDiv">
                                                        <div v-for="i in 7" :key="'rent210' + i">
                                                            <el-form-item
                                                                class="inputNumStyle"
                                                                :prop="`skus.${index}.rent210.${i - 1}`"
                                                                :rules="[
                                                                    {
                                                                        required: item.active210,
                                                                        message: `请输入第${i}期租金`,
                                                                    },
                                                                ]"
                                                            >
                                                                <el-input-number v-model="item.rent210[i - 1]" :placeholder="`第${i}期租金`" clearable :min="0.01" :precision="2" :disabled="!item.active210" controls-position="right" />
                                                            </el-form-item>
                                                        </div>
                                                    </div>
                                                    <span>
                                                        总租金 :
                                                        {{ item.active210 ? takePrice(item.rent210) : 0 }}
                                                        元
                                                    </span>
                                                    <span style="margin-left: 10px" v-if="item.leaseMethod == 0">买断价(元):&nbsp;</span>
                                                    <el-form-item
                                                        :prop="`skus.${index}.buyOutPrice210`"
                                                        v-if="item.leaseMethod == 0"
                                                        :rules="[
                                                            {
                                                                required: item.active210,
                                                                message: '请输入买断价',
                                                            },
                                                        ]"
                                                    >
                                                        <el-input-number v-model="item.buyOutPrice210" placeholder="请输入买断价" :disabled="!item.active210" clearable :min="0.01" :precision="2" controls-position="right" />
                                                    </el-form-item>
                                                    <span style="margin-left: 10px">
                                                        产品签约价值(元) :
                                                        {{ (item.marketPrice[6] = item.active210 ? takeMarkePrice(item.rent210, item.buyOutPrice210) : '0.00') }}元
                                                    </span>
                                                </el-row>
                                            </el-col>
                                            <el-col :span="24" class="warinTextRent">
                                                <span>此租期目前暂不开放</span>
                                            </el-col>
                                        </el-row>
                                        <!-- 八期 -->
                                        <el-row class="marginT20" :class="dialogTitle == '修改' && state.disabledRentDate[7].status != 1 ? 'disabledRow' : ''" v-if="dialogTitle == '新增' ? state.disabledRentDate[7].status == 1 : dialogTitle == '修改' ? state.disabledRentDate[7].status == 1 || item.isShow240 : item.isShow240">
                                            <el-col :span="4">
                                                <el-form-item>
                                                    <el-checkbox v-model="item.active240" :disabled="dialogTitle == '修改' && state.disabledRentDate[7].status != 1" label="八期/租期240天" />
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="20">
                                                <el-row :class="!item.active240 ? 'errorShow' : ''">
                                                    租金(元/期) :&nbsp;
                                                    <div class="priceDiv">
                                                        <div v-for="i in 8" :key="'rent240' + i">
                                                            <el-form-item
                                                                class="inputNumStyle"
                                                                :prop="`skus.${index}.rent240.${i - 1}`"
                                                                :rules="[
                                                                    {
                                                                        required: item.active240,
                                                                        message: `请输入第${i}期租金`,
                                                                    },
                                                                ]"
                                                            >
                                                                <el-input-number v-model="item.rent240[i - 1]" :placeholder="`第${i}期租金`" clearable :min="0.01" :precision="2" :disabled="!item.active240" controls-position="right" />
                                                            </el-form-item>
                                                        </div>
                                                    </div>
                                                    <span>
                                                        总租金 :
                                                        {{ item.active240 ? takePrice(item.rent240) : 0 }}
                                                        元
                                                    </span>
                                                    <span style="margin-left: 10px" v-if="item.leaseMethod == 0">买断价(元):&nbsp;</span>
                                                    <el-form-item
                                                        :prop="`skus.${index}.buyOutPrice240`"
                                                        v-if="item.leaseMethod == 0"
                                                        :rules="[
                                                            {
                                                                required: item.active240,
                                                                message: '请输入买断价',
                                                            },
                                                        ]"
                                                    >
                                                        <el-input-number v-model="item.buyOutPrice240" placeholder="请输入买断价" :disabled="!item.active240" clearable :min="0.01" :precision="2" controls-position="right" />
                                                    </el-form-item>
                                                    <span style="margin-left: 10px">
                                                        产品签约价值(元) :
                                                        {{ (item.marketPrice[7] = item.active240 ? takeMarkePrice(item.rent240, item.buyOutPrice240) : '0.00') }}元
                                                    </span>
                                                </el-row>
                                            </el-col>
                                            <el-col :span="24" class="warinTextRent">
                                                <span>此租期目前暂不开放</span>
                                            </el-col>
                                        </el-row>
                                        <!-- 九期 -->
                                        <el-row class="marginT20" :class="dialogTitle == '修改' && state.disabledRentDate[8].status != 1 ? 'disabledRow' : ''" v-if="dialogTitle == '新增' ? state.disabledRentDate[8].status == 1 : dialogTitle == '修改' ? state.disabledRentDate[8].status == 1 || item.isShow270 : item.isShow270">
                                            <el-col :span="4">
                                                <el-form-item>
                                                    <el-checkbox v-model="item.active270" :disabled="dialogTitle == '修改' && state.disabledRentDate[8].status != 1" label="九期/租期270天" />
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="20">
                                                <el-row :class="!item.active270 ? 'errorShow' : ''">
                                                    租金(元/期) :&nbsp;
                                                    <div class="priceDiv">
                                                        <div v-for="i in 9" :key="'rent270' + i">
                                                            <el-form-item
                                                                class="inputNumStyle"
                                                                :prop="`skus.${index}.rent270.${i - 1}`"
                                                                :rules="[
                                                                    {
                                                                        required: item.active270,
                                                                        message: `请输入第${i}期租金`,
                                                                    },
                                                                ]"
                                                            >
                                                                <el-input-number v-model="item.rent270[i - 1]" :placeholder="`第${i}期租金`" clearable :min="0.01" :precision="2" :disabled="!item.active270" controls-position="right" />
                                                            </el-form-item>
                                                        </div>
                                                    </div>
                                                    <span>
                                                        总租金 :
                                                        {{ item.active270 ? takePrice(item.rent270) : 0 }}
                                                        元
                                                    </span>
                                                    <span style="margin-left: 10px" v-if="item.leaseMethod == 0">买断价(元):&nbsp;</span>
                                                    <el-form-item
                                                        :prop="`skus.${index}.buyOutPrice270`"
                                                        v-if="item.leaseMethod == 0"
                                                        :rules="[
                                                            {
                                                                required: item.active270,
                                                                message: '请输入买断价',
                                                            },
                                                        ]"
                                                    >
                                                        <el-input-number v-model="item.buyOutPrice270" placeholder="请输入买断价" :disabled="!item.active270" clearable :min="0.01" :precision="2" controls-position="right" />
                                                    </el-form-item>
                                                    <span style="margin-left: 10px">
                                                        产品签约价值(元) :
                                                        {{ (item.marketPrice[8] = item.active270 ? takeMarkePrice(item.rent270, item.buyOutPrice270) : '0.00') }}元
                                                    </span>
                                                </el-row>
                                            </el-col>
                                            <el-col :span="24" class="warinTextRent">
                                                <span>此租期目前暂不开放</span>
                                            </el-col>
                                        </el-row>
                                        <!-- 十期 -->
                                        <el-row class="marginT20" :class="dialogTitle == '修改' && state.disabledRentDate[9].status != 1 ? 'disabledRow' : ''" v-if="dialogTitle == '新增' ? state.disabledRentDate[9].status == 1 : dialogTitle == '修改' ? state.disabledRentDate[9].status == 1 || item.isShow300 : item.isShow300">
                                            <el-col :span="4">
                                                <el-form-item>
                                                    <el-checkbox v-model="item.active300" :disabled="dialogTitle == '修改' && state.disabledRentDate[9].status != 1" label="十期/租期300天" />
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="20">
                                                <el-row :class="!item.active300 ? 'errorShow' : ''">
                                                    租金(元/期) :&nbsp;
                                                    <div class="priceDiv">
                                                        <div v-for="i in 10" :key="'rent300' + i">
                                                            <el-form-item
                                                                class="inputNumStyle"
                                                                :prop="`skus.${index}.rent300.${i - 1}`"
                                                                :rules="[
                                                                    {
                                                                        required: item.active300,
                                                                        message: `请输入第${i}期租金`,
                                                                    },
                                                                ]"
                                                            >
                                                                <el-input-number v-model="item.rent300[i - 1]" :placeholder="`第${i}期租金`" clearable :min="0.01" :precision="2" :disabled="!item.active300" controls-position="right" />
                                                            </el-form-item>
                                                        </div>
                                                    </div>
                                                    <span>
                                                        总租金 :
                                                        {{ item.active300 ? takePrice(item.rent300) : 0 }}
                                                        元
                                                    </span>
                                                    <span style="margin-left: 10px" v-if="item.leaseMethod == 0">买断价(元):&nbsp;</span>
                                                    <el-form-item
                                                        :prop="`skus.${index}.buyOutPrice300`"
                                                        v-if="item.leaseMethod == 0"
                                                        :rules="[
                                                            {
                                                                required: item.active300,
                                                                message: '请输入买断价',
                                                            },
                                                        ]"
                                                    >
                                                        <el-input-number v-model="item.buyOutPrice300" placeholder="请输入买断价" :disabled="!item.active300" clearable :min="0.01" :precision="2" controls-position="right" />
                                                    </el-form-item>
                                                    <span style="margin-left: 10px">
                                                        产品签约价值(元) :
                                                        {{ (item.marketPrice[9] = item.active300 ? takeMarkePrice(item.rent300, item.buyOutPrice300) : '0.00') }}元
                                                    </span>
                                                </el-row>
                                            </el-col>
                                            <el-col :span="24" class="warinTextRent">
                                                <span>此租期目前暂不开放</span>
                                            </el-col>
                                        </el-row>
                                        <!-- 十一期 -->
                                        <el-row class="marginT20" :class="dialogTitle == '修改' && state.disabledRentDate[10].status != 1 ? 'disabledRow' : ''" v-if="dialogTitle == '新增' ? state.disabledRentDate[10].status == 1 : dialogTitle == '修改' ? state.disabledRentDate[10].status == 1 || item.isShow330 : item.isShow330">
                                            <el-col :span="4">
                                                <el-form-item>
                                                    <el-checkbox v-model="item.active330" :disabled="dialogTitle == '修改' && state.disabledRentDate[10].status != 1" label="十一期/租期330天" />
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="20">
                                                <el-row :class="!item.active330 ? 'errorShow' : ''">
                                                    租金(元/期) :&nbsp;
                                                    <div class="priceDiv">
                                                        <div v-for="i in 11" :key="'rent330' + i">
                                                            <el-form-item
                                                                class="inputNumStyle"
                                                                :prop="`skus.${index}.rent330.${i - 1}`"
                                                                :rules="[
                                                                    {
                                                                        required: item.active330,
                                                                        message: `请输入第${i}期租金`,
                                                                    },
                                                                ]"
                                                            >
                                                                <el-input-number v-model="item.rent330[i - 1]" :placeholder="`第${i}期租金`" clearable :min="0.01" :precision="2" :disabled="!item.active330" controls-position="right" />
                                                            </el-form-item>
                                                        </div>
                                                    </div>
                                                    <span>
                                                        总租金 :
                                                        {{ item.active330 ? takePrice(item.rent330) : 0 }}
                                                        元
                                                    </span>
                                                    <span style="margin-left: 10px" v-if="item.leaseMethod == 0">买断价(元):&nbsp;</span>
                                                    <el-form-item
                                                        :prop="`skus.${index}.buyOutPrice330`"
                                                        v-if="item.leaseMethod == 0"
                                                        :rules="[
                                                            {
                                                                required: item.active330,
                                                                message: '请输入买断价',
                                                            },
                                                        ]"
                                                    >
                                                        <el-input-number v-model="item.buyOutPrice330" placeholder="请输入买断价" :disabled="!item.active330" clearable :min="0.01" :precision="2" controls-position="right" />
                                                    </el-form-item>
                                                    <span style="margin-left: 10px">
                                                        产品签约价值(元) :
                                                        {{ (item.marketPrice[10] = item.active330 ? takeMarkePrice(item.rent330, item.buyOutPrice330) : '0.00') }}元
                                                    </span>
                                                </el-row>
                                            </el-col>
                                            <el-col :span="24" class="warinTextRent">
                                                <span>此租期目前暂不开放</span>
                                            </el-col>
                                        </el-row>
                                        <!-- 十二期 -->
                                        <el-row class="marginT20" :class="dialogTitle == '修改' && state.disabledRentDate[11].status != 1 ? 'disabledRow' : ''" v-if="dialogTitle == '新增' ? state.disabledRentDate[11].status == 1 : dialogTitle == '修改' ? state.disabledRentDate[11].status == 1 || item.isShow360 : item.isShow360">
                                            <el-col :span="4">
                                                <el-form-item>
                                                    <el-checkbox v-model="item.active360" :disabled="dialogTitle == '修改' && state.disabledRentDate[11].status != 1" label="十二期/租期360天" />
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="20">
                                                <el-row :class="!item.active360 ? 'errorShow' : ''">
                                                    租金(元/期) :&nbsp;
                                                    <div class="priceDiv">
                                                        <div v-for="i in 12" :key="'rent360' + i">
                                                            <el-form-item
                                                                class="inputNumStyle"
                                                                :prop="`skus.${index}.rent360.${i - 1}`"
                                                                :rules="[
                                                                    {
                                                                        required: item.active360,
                                                                        message: `请输入第${i}期租金`,
                                                                    },
                                                                ]"
                                                            >
                                                                <el-input-number v-model="item.rent360[i - 1]" :placeholder="`第${i}期租金`" clearable :min="0.01" :precision="2" :disabled="!item.active360" controls-position="right" />
                                                            </el-form-item>
                                                        </div>
                                                    </div>
                                                    <span>
                                                        总租金 :
                                                        {{ item.active360 ? takePrice(item.rent360) : 0 }}
                                                        元
                                                    </span>
                                                    <span style="margin-left: 10px" v-if="item.leaseMethod == 0">买断价(元):&nbsp;</span>
                                                    <el-form-item
                                                        :prop="`skus.${index}.buyOutPrice360`"
                                                        v-if="item.leaseMethod == 0"
                                                        :rules="[
                                                            {
                                                                required: item.active360,
                                                                message: '请输入买断价',
                                                            },
                                                        ]"
                                                    >
                                                        <el-input-number v-model="item.buyOutPrice360" placeholder="请输入买断价" :disabled="!item.active360" clearable :min="0.01" :precision="2" controls-position="right" />
                                                    </el-form-item>
                                                    <span style="margin-left: 10px">
                                                        产品签约价值(元) :
                                                        {{ (item.marketPrice[11] = item.active360 ? takeMarkePrice(item.rent360, item.buyOutPrice360) : '0.00') }}元
                                                    </span>
                                                </el-row>
                                            </el-col>
                                            <el-col :span="24" class="warinTextRent">
                                                <span>此租期目前暂不开放</span>
                                            </el-col>
                                        </el-row>
                                        <!-- <el-row class="marginT20">
                                            <el-col :span="24">
                                                <el-form-item label="90天及以上" :prop="`skus.${index}.rent90`">
                                                    <el-input-number v-model="item.rent90" placeholder="请输入数字" clearable
                                                        :min="0" :precision="2" :max="99999" :controls="false"
                                                        style="width: 100%" @blur="takeStartRentDay(item)" />
                                                </el-form-item>
                                            </el-col>
                                        </el-row>
                                        <el-row class="marginT20">
                                            <el-col :span="24">
                                                <el-form-item label="180天及以上" :prop="`skus.${index}.rent180`">
                                                    <el-input-number v-model="item.rent180" placeholder="请输入数字"
                                                        clearable :min="0" :precision="2" :max="99999" :controls="false"
                                                        style="width: 100%" @blur="takeStartRentDay(item)" />
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="365天及以上" :prop="`skus.${index}.rent360`">
                                                    <el-input-number v-model="item.rent360" placeholder="请输入数字" clearable :min="0"
                                                        :precision="2" :max="99999" :controls="false" style="width: 100%"
                                                        @blur="takeStartRentDay(item)" />
                                                </el-form-item>
                                            </el-col>
                                        </el-row> -->
                                    </section>
                                </el-card>
                            </div>
                        </el-form-item>
                    </section>
                </el-tab-pane>
            </el-tabs>
        </el-form>

        <template #footer>
            <span class="flex-align-end" v-if="!isDisableds">
                <div class="margin-right20">
                    <el-button @click="close">取消</el-button>
                </div>
                <el-button type="primary" @click="sure">确定</el-button>
            </span>
        </template>
    </el-dialog>
</template>

<style lang="scss" scoped>
:deep(.el-card__header) {
    padding-top: 15px;
    padding-bottom: 15px;
}

.warinText {
    font-size: 12px;
    color: rgb(245, 108, 108);
    display: block;
    margin-top: -6px;
    line-height: 12px;
    float: left;
    height: 12px;
}
.warinTextRent {
    display: none;
}
.disabledRow {
    color: #a8abb2;
    .warinTextRent {
        color: #a8abb2;
        margin-left: 22px;
        display: block;
    }
}

:deep(.el-input-number input) {
    text-align: left;
}
.errorShow :deep(.el-form-item__error) {
    display: none;
}

.hoverTitle {
    padding: 0 20px;
    width: 20px;
    height: 20px;
}

:deep(.el-input-group__append, .el-input-group__prepend) {
    padding: 0 !important;
}
.inputNumStyle {
    width: 160px;
    margin-left: 20px;
}
.priceDiv {
    width: 85%;
    display: flex;
    flex-wrap: wrap;
    > div {
        margin-bottom: 20px;
        margin-right: 20px;
    }
}
</style>
